<template>
	<view >
		<searchBar :searchBgColor="searchBgColor" rightIcon="icon-comment" placeText="我和我的祖国"></searchBar>
		<view :style="{'height':zhanwei+'px'}"></view>
		<view class="content">
			<indexSwiper :hasFresh="isFresh" ></indexSwiper>
			<classEnter :hasFresh="isFresh"></classEnter>
			<image class="grEmpty" mode="widthFix" src="http://s.de123.com/grow/index.png" @tap="toPage" data-url="growthRecord"></image>
			<famousTeacher :hasFresh="isFresh"></famousTeacher>
			<hot-sale :hasFresh="isFresh"></hot-sale>
		</view>
		<screenBar ref="screenBar" :cntHeight="cntHeight" :top="top" :isFiexd="isFiexd"></screenBar>
		
		<goodList :goodData="rmdList"></goodList>
		
		<view :style="{'height':hgt+'px'}" v-if="rmdList.length<1">
			<emptyBox :isLoding="loding"></emptyBox>
		</view>
		<updateModal ref="upModal"></updateModal>
		<hk-modal ref="hkModal"></hk-modal>
		<downLoading></downLoading>
		<imagePoup></imagePoup>
		<imageScroll :scType="scType"></imageScroll>
		<klBox></klBox>
	</view>
</template>

<script>
	import COMM from "@/common/common.js";
	import searchBar from "@/components/searchBar/searchBar.vue";
	import swiperBox from "@/components/swiperBox/swiperBox.vue";
	import classEnter from "@/components/classEnter/classEnter.vue";
	import hotSale from "@/components/hotSale/hotSale.vue";
	import goodList from "@/components/goodList/goodList.vue";
	import screenBar from "@/components/screenBar/screenBar.vue";
	import statusBar from "@/components/statusBar/statusBar.vue";
	import indexSwiper from "@/components/indexSwiper/indexSwiper.vue";
	import updateModal from "@/components/updateModal/updateModal.vue";
	import PRSN from "@/js_sdk/wa-permission/permission.js";
	import emptyBox from "@/components/emptyBox/emptyBox.vue";
	import Request from "@/sdk/pocky-request/index.js";
	import famousTeacher from "@/components/famousTeacher/famousTeacher.vue";
	import downLoading from "@/components/downLoding/downLoding.vue";
	import klBox from "@/components/klBox.vue";
	import imagePoup from "@/components/imagePoup/imagePoup.vue";
	import imageScroll from "@/components/imageScroll/imageScroll.vue";
	import {
		mapState,
		mapGetters,
		mapMutation,
		mapActions
	} from "vuex";
	export default {
		components: {
			searchBar,
			swiperBox,
			classEnter,
			hotSale,
			goodList,
			screenBar,
			statusBar,
			indexSwiper,
			updateModal,
			emptyBox,
			famousTeacher,
			downLoading,
			klBox,
			imagePoup,
			imageScroll
		},
		computed: {
			...mapState({
				sysInfo: state => state.sys.sysInfo,
				locationCity: state => state.map.locationCity,
				initInfo: state => state.sys.initInfo,
				roads: state => state.map.roads,
				selectCity: state => state.map.selectCity,
				userInfo:state=>state.user.userInfo,
				pushId:state=>state.push.pushId,
				imei:state=>state.push.imei,
				isLogin: state => state.user.isLogin,
				allCount: state => state.user.allCount,
			})

		},
		data() {
			return {
				searchBgColor: '#ffcd11',
				isFiexd: false,
				cntHeight: 0,
				top: 0,
				scHeight: uni.getSystemInfoSync().windowHeight - uni.getSystemInfoSync().windowBottom - uni.upx2px(90),
				isFresh: true,
				hasNext: true,
				page_no: 1,
				hgt: uni.getSystemInfoSync().windowHeight,
				areaId: 0,
				rmdList: [],
				zhanwei: uni.getSystemInfoSync().statusBarHeight + uni.upx2px(90),
				rmdFilter: {
					page_no: 1,
					page_size: 10,
					areaId: 0
				},
				swiperList: [],
				classList: [],
				hotSaleList: [],
				loding:true,
				scType:0
			}
		},

		methods: {
			scView(e) {
				console.log(e.detail.scrollTop);
				if (e.detail.scrollTop >= this.cntHeight || this.$refs.screenBar.show) {
					this.isFiexd = true
				} else {
					this.isFiexd = false
				}
			},
			getRmd() {
				this.rmdFilter.areaId = this.selectCity.cityCode;
				this.rmdFilter.guideCate=uni.getStorageSync("xinqu");
				if (this.hasNext) {
					this.$store.dispatch("apiGetRmdGoodList", this.rmdFilter).then(res => {
						this.rmdList = this.rmdList.concat(res.data.data.items)
						this.rmdFilter.page_no = res.data.data.nextPage;
						this.hasNext = res.data.data.hasNext
						this.loding=false;
					})
				} else {
					uni.showToast({
						title: '没有更多数据了',
						icon: 'none'
					});
				}

			},
			

		},
		watch: {
			selectCity(newVal) {
				this.isFresh = false;
				this.hasNext = true;
				this.rmdList = [];
				this.rmdFilter = {
					page_no: 1,
					page_size: 10,
					areaId: newVal.cityCode
				};
				this.getRmd();
				this.isFresh = true;
			}
		},
		onLoad() {
			
			var _this = this;
			if(this.rmdList.length<1){
				this.getRmd()
			}
			
			uni.$on("roadsChange",()=>{
				this.isFresh = false;
				this.rmdFilter.page_no = 1;
				this.hasNext = true;
				this.rmdFilter.areaId = this.locationCity.adcode.substr(0, 4);
				this.rmdList = [];
				this.loding=true;
				setTimeout(() => {
					this.isFresh = true;
					this.getRmd()
				}, 1500)
			})
			// 监听区域选择
			uni.$on("changeArea", payload => {
				this.rmdList = [];
				this.rmdFilter.page_no = 1;
				this.hasNext = true;
				this.rmdFilter.areaId = payload.areaId
				delete this.rmdFilter.streetId
				this.getRmd()
			})
			// 监听商圈选择
			uni.$on("changeStreet", payload => {
				this.rmdList = [];
				this.rmdFilter.page_no = 1;
				this.hasNext = true;
				this.rmdFilter.streetId = payload.streetId,
				this.rmdFilter.areaId = payload.areaId.toString().substr(0, 4)
				this.getRmd()
			})
			// 监听距离排序
			uni.$on("rankChange", payload => {
				this.rmdList = [];
				this.rmdFilter.page_no = 1;
				this.hasNext = true;
				if (payload.type == 0) {
					delete this.rmdFilter.orderBy;
					delete this.rmdFilter.longi;
					delete this.rmdFilter.lati;
				} else {
					this.rmdFilter.orderBy = payload.type
					if (payload.type == 5) {
						this.rmdFilter.longi = this.roads.longitude;
						this.rmdFilter.lati = this.roads.latitude;
					} else {
						delete this.rmdFilter.longi;
						delete this.rmdFilter.lati;
					}
				}
				// console.log(this.rmdFilter);
				this.getRmd()
			})
			// 监听分类选择
			uni.$on("classChange", payload => {
				this.rmdList = [];
				this.rmdFilter.page_no = 1;
				this.hasNext = true;
				if (payload.type == 'firCate') {
					delete this.rmdFilter.secCate;
					delete this.rmdFilter.thirCate;
					this.rmdFilter.firCate = payload.firCate;

				} else if (payload.type == 'secCate') {
					delete this.rmdFilter.thirCate;
					this.rmdFilter.firCate = payload.firCate;
					this.rmdFilter.secCate = payload.secCate;
				} else {
					this.rmdFilter.firCate = payload.firCate;
					this.rmdFilter.secCate = payload.secCate;
					this.rmdFilter.thirCate = payload.thirCate;
				}

				this.getRmd()
			})
			// 监听筛选选择
			uni.$on("changeScreen", payload => {
				this.rmdList = [];
				this.rmdFilter.page_no = 1;
				this.hasNext = true;
				if (payload.hasOwnProperty('type')) {
					this.rmdFilter.type = payload.type
				} else {
					delete this.rmdFilter.type
				}
				if (payload.hasOwnProperty('percent')) {
					this.rmdFilter.percent = payload.percent
				} else {
					delete this.rmdFilter.percent
				}
				if (payload.hasOwnProperty('age')) {
					this.rmdFilter.age = payload.age
				} else {
					delete this.rmdFilter.age
				}
				if (payload.hasOwnProperty('price1')) {
					this.rmdFilter.price1 = payload.price1
				} else {
					delete this.rmdFilter.price1
				}
				if (payload.hasOwnProperty('price2')) {
					this.rmdFilter.price2 = payload.price2
				} else {
					delete this.rmdFilter.price2
				}
				this.getRmd()

			})

			
			// 自动登录
			if (uni.getStorageSync('token')) {
				this.$store.dispatch("apiUserAutoLogin", {
					token: uni.getStorageSync('token')
				}).then(res => {
					setTimeout(() => {
						this.$store.dispatch("timLogin", res.data.data.imid).then(timRes => {
							console.log(timRes)
							setTimeout(() => {
								this.$store.dispatch("timEditInfo", {
									nick: res.data.data.nickname,
									role: 2
								});
								
							}, 1000)
						})
						
						// #ifdef APP-PLUS
						if(this.pushId){
							this.$store.dispatch("eidtUserInfo",{
								userId:this.userInfo.userId,
								pushId:this.pushId,
								imei:this.imei
							})
						}
						// #endif
					}, 500)
				}).catch(res => {
					// this.toPage("login")
				})
			}

			// #ifdef APP-PLUS
			this.$store.dispatch("getNowAppInfo")
			this.$store.dispatch("apiGetUpdateInfo").then(res => {
				this.$store.dispatch("checkUpDate");
			})
			// #endif



			// 获取筛选条浮动高度
			setTimeout(() => {
				let query = uni.createSelectorQuery().in(this);
				query.select('.content').boundingClientRect(data => {
					this.cntHeight = data.height
				}).exec();
			}, 500)

			uni.$on('toPageScroll', () => {
				uni.pageScrollTo({
					scrollTop: _this.cntHeight,
					duration: 300
				});
			})
			uni.$on("showModal", (str) => {
				if (str.type == "location") {
					uni.showModal({
						title:"权限请求提示",
						content:"获取定位权限将为您推荐附近课程和机构。\n操作路径：设置->应用->找培训->权限",
						showCancel:false,
						confirmText:'去设置',
						success:(res)=>{
							if(res.confirm){
								PRSN.gotoAppPermissionSetting();
							}
						}
					})
				} else if (str.type == "gps") {
					uni.showModal({
						title:"GPS定位失败",
						content:"获取GPS信号失败，请检查GPS是否打开。",
						showCancel:false,
						confirmText:'确定'
					})
					
				}
			})
			
		},
		// 设置筛选条是否为固定定位
		onPageScroll(e) {
			if(this.top>e.scrollTop){
				this.scType=-1
			}else if(this.top<e.scrollTop){
				this.scType=1
			}
			this.top = e.scrollTop
			if (e.scrollTop >= this.cntHeight || this.$refs.screenBar.show) {
				this.isFiexd = true
			} else {
				this.isFiexd = false
			}
			
		},
		// 页面滚动到底部
		onReachBottom() {
			if (this.hasNext) {
				this.getRmd()
			} else {
				uni.showToast({
					title: '没有更多的数据了',
					icon: 'none'
				});
			}
		},
		// 下拉刷新
		onPullDownRefresh() {
			this.isFresh = false;
			this.rmdFilter.page_no = 1;
			this.hasNext = true;
			this.rmdFilter.areaId = this.locationCity.adcode.substr(0, 4);
			this.rmdList = [];
			this.loding=true;
			setTimeout(() => {
				
				this.isFresh = true;
				this.getRmd()
				
				uni.stopPullDownRefresh();
				
			}, 1500)
		}

	}
</script>

<style lang="less">
	.hoverImg{
		position: fixed;
		width: 100upx;
		right: -50upx;
		top: 50%;
		z-index: 9999;
	}
	.grEmpty{
		width: 100%;
		border-radius: 20upx;
	}
</style>
